<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Project a point</title>

    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.4/js/dojo/dijit/themes/claro/claro.css">
    <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.4" type="text/javascript"></script>

    <script type="text/javascript">
      dojo.require("esri.map");
      dojo.require("esri.tasks.geometry");

      var map = null;
      var gsvc = null;
      var pt = null;

      function initialize() {
        map = new esri.Map("map");
        var layer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer");
        map.addLayer(layer);
        map.setExtent(new esri.geometry.Extent(-144.13, 7.98, -52.76, 68.89, new esri.SpatialReference({wkid: 4326})));
        map.infoWindow.resize(360, 120);

        gsvc = new esri.tasks.GeometryService("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
        dojo.connect(map, "onClick", projectToWebMercator);
      }

      function projectToWebMercator(evt) {
        map.graphics.clear();
        
        var point = evt.mapPoint;
        var symbol = new esri.symbol.SimpleMarkerSymbol().setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND);
        var graphic = new esri.Graphic(point, symbol);
        var outSR = new esri.SpatialReference({ wkid: 102113});

        // convert client side
        var wm = esri.geometry.geographicToWebMercator(point);
        var test = toWebMercator(point);
        console.log(test.x + ";" + test.y);
        
        map.graphics.add(graphic);

        gsvc.project([ point ], outSR, function(projectedPoints) {
          pt = projectedPoints[0];
          // display both geometry service result and the client side result
          graphic.setInfoTemplate(new esri.InfoTemplate("Coordinates",
            "<table><tbody><tr><td>Geometry Service:</td><td>" + pt.x.toFixed(3) + ", " + pt.y.toFixed(3) +
            "</td></tr><tr><td>Client Side:</td><td>" + wm.x.toFixed(3) + ", " + wm.y.toFixed(3) + "</td></tr></tbody></table>"
          ));
          map.infoWindow
            .setTitle(graphic.getTitle())
            .setContent(graphic.getContent())
            .show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));
        });
      }
      
      function toWebMercator(pt) {
      	var num = pt.x * 0.017453292519943295;
      	var x = 6378137.0 * num;
      	var a = pt.y * 0.017453292519943295;
      	var y =3189068.5 *  Math.log((1.0 + Math.sin(a)) / (1.0 - Math.sin(a)));
      	
      	return new esri.geometry.Point({"x": x, "y": y, "spatialReference": {"wkid": 102113 } });
      }
      
      dojo.addOnLoad(initialize);
    </script>

  </head>
  <body class="claro">
    <b>Click a location on the map to Project from LatLng -> Web Mercator:</b>
    <div id="map" style="width:800px; height:800px; border:1px solid #000;"></div>
  </body>